<template>
    <div>
        <h1>{{ message }}</h1>
        <h1>{{ studentId }}</h1>
    </div>
</template>

<script>
export default {
    name: 'Student1',
    data() {
        return {
            message: 'Hello from Student 1!',
            studentId: '',
        }
    },
    methods: {
        getStudentId() {
            const studentId = this.$route.params.id;
            console.log(`Student ID: ${studentId}`);
        }
    },
    watch: {
        '$route.params.id'(newId) {
            this.studentId = newId;
            console.log(`Student ID: ${this.studentId}`);
        }
    },
    created() {
        this.getStudentId();
    }

}
</script>